<template>
  <div v-html="processedContent"></div>
</template>

<script setup>
import { defineProps, computed } from "vue";
// 调整 marked 引入方式
import { marked } from "marked";

const props = defineProps({
  content: {
    type: String,
    required: true,
  },
});

// 使用 marked 处理 Markdown 文本
const processedContent = computed(() => {
  if (marked && typeof marked.parse === 'function') {
    return marked.parse(props.content);
  } else {
    console.error('marked.parse 不可用');
    return '';
  }
});
</script>

<style scoped>
/* 可以添加一些样式来美化输出 */
</style>